window.onload = function () {

    if (document.querySelector('.header-right-a').innerText === '退出') {
        // console.log('执行...')
        document.querySelector('.basicShow').style.display = 'none'
    } else {
        document.querySelector('.basicShow').style.display = ''
    }

    if (document.querySelector('.layui-carousel-arrow[lay-type=add]')) {
        document.querySelector('.layui-carousel-arrow[lay-type=add]').innerText = '>'
        document.querySelector('.layui-carousel-arrow[lay-type=sub]').innerText = '<'
    }
}

layui.use('element', function () {
    var element = layui.element;

    //一些事件触发
    element.on('tab(demo)', function (data) {
        console.log(data);
    });
});

layui.use('carousel', function () {
    var carousel = layui.carousel;
    //建造实例
    carousel.render({
        elem: '#test1'
        , width: '100%' //设置容器宽度
        , arrow: 'always' //始终显示箭头
        , anim: 'fade' //切换动画方式
    });
});

layui.use('flow', function () {
    var flow = layui.flow;

    flow.load({
        elem: '#LAY_demo1' //流加载容器
        , scrollElem: '#LAY_demo1' //滚动条所在元素，一般不用填，此处只是演示需要。
        , done: function (page, next) { //执行下一页的回调

            //模拟数据插入
            setTimeout(function () {
                var lis = [];
                for (var i = 0; i < 8; i++) {
                    lis.push('<li>' + ((page - 1) * 8 + i + 1) + '</li>')
                }

                //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
                //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
                next(lis.join(''), page < 10); //假设总页数为 10
            }, 500);
        }
    });

    flow.load({
        elem: '#LAY_demo2' //流加载容器
        , scrollElem: '#LAY_demo2' //滚动条所在元素，一般不用填，此处只是演示需要。
        , isAuto: false
        , isLazyimg: true
        , done: function (page, next) { //加载下一页
            //模拟插入
            setTimeout(function () {
                var lis = [];
                for (var i = 0; i < 6; i++) {
                    lis.push('<li><img lay-src="../../../res/upload/2017_3/168_1488985841996_23077.png?v=' + ((page - 1) * 6 + i + 1) + '"></li>')
                }
                next(lis.join(''), page < 6); //假设总页数为 6
            }, 500);
        }
    });

    //按屏加载图片
    flow.lazyimg({
        elem: '#LAY_demo3 img'
        , scrollElem: '#LAY_demo3' //一般不用设置，此处只是演示需要。
    });

});


const vm = new Vue({
    el: '#root',
    mounted() {
        // this.getBookList();
        this.getBookPage(1);
        this.getMenuList()
    },
    data: {
        books: [],
        bookTotal: null, // 修改成null , 就不会type check failed for prop "total". Expected Number with value 0, got String with value ""
        menuData: []
    },
    methods: {
        getBookList() {
            axios.get('http://localhost:8080/select/book')
                .then(response => {
                    // console.log(response)
                    this.books = response.data.records
                })
        },
        buyBook(bookName, bookPrice) {
            this.$confirm('是否加入购物车', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'success'
            }).then(() => {
                this.addShoppingCart(bookName, bookPrice);
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '取消成功'
                });
            });
        },
        addShoppingCart(bookName, bookPrice) {
            axios.get('http://localhost:8080/insert/cart/' + bookName + '/price/' + bookPrice)
                .then(response => {
                    /*console.log("加入购物车成功")*/
                    this.$message({
                        type: 'success',
                        message: '加入购物车成功'
                    })
                }).catch((response) => {
                this.$message({
                    type: 'info',
                    message: '您还没有登录, 请先登录!'
                });
            })
        },
        getBookPage(pageNum) {
            axios.get('http://localhost:8080/select/book/' + pageNum + '/15')
                .then(response => {
                    // console.log(response)
                    this.books = response.data.records
                    this.bookTotal = Math.floor(response.data.total / 15) * 15
                })
        },
        handleCurrentChange(pageNum) {
            this.getBookPage(pageNum);
            // console.log(pageNum)
        },
        getMenuList() {
            axios.get('http://localhost:8080/admin/system/classif/findAll').then(
                response => {
                    // console.log('getMenuList', response)
                    this.menuData = response.data.data
                    console.log('getMenuList', this.menuData)
                }
            ).catch(errors => {

            })
        }
    },
})
